<!DOCTYPE html>
<html>
<head>
<title>iou.ink</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta http-equiv="Cache-Control" content="no-transform" />
<meta name="renderer" content="webkit"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="generator" content="HBuilder X 2.9.3"/>
<meta name="description" content="iou.ink短域名生成"/>
<meta name="author" content="1074637681@qq.com"/>
<script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>		


<script type="text/javascript">
	    function sleep(ms) {
	            return new Promise(resolve => setTimeout(resolve, ms));
	        }
		var connectStat=0;
	    var socket;
	    var current=0;
	    var total;
	    var beforetime;
		
	    function connect(){
	        var host = "ws://" + '42.192.91.114:9998/';
	        //document.getElementById("btnConnect").value = "连接中";
	        socket = new WebSocket(host);
	        try {
	
	            socket.onopen = function (msg) {
					connectStat=1;
	                //alert("连接成功！");
					autogetURL();
	            };

	            socket.onmessage = function (msg) {
	                if (typeof msg.data == "string") {
	                    displayContent(msg.data);
	                    if(msg.data=="Receive:100%"){
	                        current=0;
	                        total=0;
	                    }
	                    else if(msg.data.substr(0,7)=="Receive"){
	                        var str1=msg.data.split(':')[1];
	                        var str2=str1.split('/')[0];
	                        picsend(parseInt(str2))
	                    }
	                }
	                else {
	                    alert("非文本消息");
	                }
	            };
	
	            socket.onerror = function (error) {
				alert("无法连接到服务器，请稍后再试\n"+ error.name); 
				connectStat=0;
					//swal("连接失败", "", "error");
				};
	
	            socket.onclose = function (msg) {
					connectStat=0;
					//alert("连接关闭!");
	                 };
	        }
	        catch (ex) {
	            log(ex);
	        }
	    }
	
	    async function send() {
	        var str ='?URL='+document.getElementById("longurl").value;
	        socket.send(str);
	    }
	
	    async function picsend(pos){
	        beforetime=new Date().getTime();
	        current=pos;
	        socket.close();
	        connect();
	        while(connectStat != 1) {await sleep(200);}
	        var str = document.getElementById("longurl").value;
	        socket.send(str.substring(pos));
	    }
	
	    window.onbeforeunload = function () {
	        try {
	            socket.close();
	            socket = null;
	        }
	        catch (ex) {
	        }
	    };
	
	    function $(id) { return document.getElementById(id); }
	

	
	    function displayContent(msg) {
			if(msg.includes("waiting for ")){
				tstr0=msg.replace("waiting for ",'');
				tstr1=tstr0.replace(" seconds",'');
				alert("请勿频繁操作！请等待"+tstr1+"秒");
			}else if(msg.includes("http")){
				window.location.href=msg;
			}else{
				$("shorturl").value =msg;
			}
			
	    }
	    function onkey(event) { if (event.keyCode == 13) { send(); } }

function autogetURL(){
	var tempID = getQueryVariable("ID")
	if(tempID){
		var tempShort = '?ID=' +String(tempID);
		socket.send(tempShort);
}
}
function getQueryVariable(variable)
{
       var query = window.location.search.substring(1);
       var vars = query.split("&");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
}



</script>
<link rel="icon" type="image/x-icon" href="https://xyxywan.gitee.io/favicon.ico">
</head>

<body onload="connect()">
		<div id="loading" style="width: 100%;height: 100%;position: absolute;z-index: 999;">
			<div class="loader"></div>
		</div>
		<style type="text/css">
			/*--loading-css--*/
			
			
				.loader {
				  position: relative;
				  width: 2.5em;
				  height: 2.5em;
				  transform: rotate(165deg);
				}
				.loader:before, .loader:after {
				  content: '';
				  position: absolute;
				  top: 50%;
				  left: 50%;
				  display: block;
				  width: 0.5em;
				  height: 0.5em;
				  border-radius: 0.25em;
				  transform: translate(-50%, -50%);
				}
				.loader:before {
				  animation: before 2s infinite;
				}
				.loader:after {
				  animation: after 2s infinite;
				}
				
				@keyframes before {
				  0% {
				    width: 0.5em;
				    box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75);
				  }
				  35% {
				    width: 2.5em;
				    box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75);
				  }
				  70% {
				    width: 0.5em;
				    box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75);
				  }
				  100% {
				    box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75);
				  }
				}
				@keyframes after {
				  0% {
				    height: 0.5em;
				    box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75);
				  }
				  35% {
				    height: 2.5em;
				    box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75);
				  }
				  70% {
				    height: 0.5em;
				    box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75);
				  }
				  100% {
				    box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75);
				  }
				}
				/**
				 * Attempt to center the whole thing!
				 */
			
				.loader{
				  position: absolute;
				  top: calc(50% - 1.25em);
				  left: calc(50% - 1.25em);
				}
		</style>
	</body>
</html>
